<?php $this->load->view('admin/common/header'); ?>
<?php $this->load->view('admin/common/menu'); ?>
<tr>
	<td height='10px'></td>
</tr>
<tr>
	<td align='center'>
		<table cellspacing="0" cellpadding="0" border="0" width="1020px">
			<tbody>
				<tr>
					<td height="67" width="5%" class="item_menu_left">
					</td>
					<td height="67" width="40%" class="item_menu_middle">Khai báo các loại nhu cầu</td>
					<td height="67" width="55%" class="item_menu_right">
						<div>
							<button id="display" name="display" style="float: left; margin-left:10px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Xem&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</button>
							<button id="add" name="add" style="float: left;margin-left:10px;">Thêm mới</button>
							<button id="edit" name="edit" style="float: left;margin-left:10px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Sửa&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</button>
							<button id="del" name="del" style="float: left;margin-left:10px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Xóa&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</button>
						</div>

					</td>
				</tr>
			</tbody>
		</table>
	</td>
</tr>
<tr>
	<td height='10px'></td>
</tr>
<tr>
	<td align='center' style="margin-left: 20px">
		<table id="showGrid"></table>
		<div id="pager1"></div> <script>
function enterPressed(evt)
{
	var charCode = (evt.which) ? evt.which : event.keyCode;
	 if (charCode == 13) //Khong xu ly
	 {
		 return false;
	 }//Enter
}
	
jQuery().ready(function ()
 {

	$("#order_edit").keypress(function (e){
		  var charCode = (e.which) ? e.which : e.keyCode;
		  if (charCode > 31 && (charCode < 48 || charCode > 57)) {
		    return false;
		  }
	});
			

	jQuery("#showGrid").jqGrid({
	   	url:'<?php echo base_url(); ?>admin/categories/getAll',
	   	viewrecords: true,
		multiselect: true,
		mtype: "POST", 
		postData:{act:'viewAll'},
	   	datatype: "json",
	   	colNames:["Id",
		   		  "Tên", 
		   		  "Giá trị",
		   	      "Mô tả"
		   	      ],
	    colModel:[
				  {name:'id',index:'id', width:75},
				  {name:'ten',index:'cat_name', width:90},
				  {name:'giatri',index:'cat_value', width:100},
				  {name:'mota',index:'cat_desc', width:80}	
				 ],
	   	rowNum:30,
	    width: 1020,
	    height: 'auto',
	   	rowList:[30,50,100,150,200,300],
	   	pager: jQuery('#pager1'),
	   	sortname: 'id',
	    viewrecords: true,
	    sortorder: "asc",
	    caption:"Danh sách các loại nhu cầu",
	    gridComplete: function()
		{ 
			
		}
	}).navGrid('#pager1',{edit:false,add:false,del:false});

	
/* ----------------Thao tac them su xoa -------------------------*/
	$( "#display" )//Hien thi chi tiet
	.button()
	.click(function() 
	{
		processData(this.id);
	});

	$( "#add" )//Them moi user
	.button()
	.click(function() 
	{
		processData(this.id);
	});
	$( "#edit" )//Sua thong tin user
	.button()
	.click(function() 
	{
		processData(this.id);
	});
	$( "#del" )//Xoa thong tin user
	.button()
	.click(function() 
	{
		processData(this.id);
	});
});//end function ready
/*--------------------Start Fill Data---------------------------*/
function fill_Data()
{
	var id = jQuery("#showGrid").jqGrid('getGridParam','selrow'); 
	if (id) 
	{ 
		var ret = jQuery("#showGrid").jqGrid('getRowData',id);
		$('#id_edit').val(ret.id);
		$('#name_edit').val(ret.ten);
		$('#value_edit').val(ret.giatri);
		$('#desc_edit').val(ret.mota); 
		return true;
	} else 
	{ 
		alert("Please select row");
		return false;
	}	
}
/*--------------------End Fill Data---------------------------*/
/*--------------------Start clear Data---------------------------*/
function clear_Data()
{
	var blank="";
	$('#id_edit').val(blank);
	$('#name_edit').val(blank);
	$('#value_edit').val(blank);
	$('#desc_edit').val(blank);
	return true;
}
/*--------------------End clear Data---------------------------*/
/*--------------------Start check Data---------------------------*/
function check_Data()
{
	checkAdsession();
	//Ten
    if($("#name_edit").val()=='')
    {
    	 $("#name_edit").focus();
    	 $.showErr(" Xin vui lòng nhập thông tin tên");
    	 addToBasket('bee','name_edit');
    	 return false;
    }
    //Check gia tri:
    if($("#value_edit").val()=='')
    {
    	 $("#value_edit").focus();
    	 $.showErr(" Xin vui lòng nhập giá trị");
    	 addToBasket('bee','value_edit');
    	 return false;
    }
 
	return true;
}
/*--------------------End check Data---------------------------*/

/*--------------------Start Process Data---------------------------*/

function processData(control)
{
	checkAdsession();
    var openDlg=false;
	//Open dialog:
	jQuery( "#dlg_edit" ).dialog({
		autoOpen: false,
		height: 280,
		width: 500,
		modal: true,
		close: function(ev, ui) 
		{ 		
			
        },
		buttons: {
			Exit: { text:'Thoát',
				 click:function() {
				 	$( this ).dialog( "close" );	
				}	
			},
			Add:{text:'Thêm mới',
				click:function() {
				 
				   if(!check_Data()) return;
				   var method={act:'add'};
				   var myJSONtext=$('#myForm').toJSON();
				   var output = {};
					output = jsonConcat(output, myJSONtext);
					output = jsonConcat(output, method);				
					$.ajax
				    ({
				        type: "POST",
				        url: '<?php echo base_url(); ?>admin/categories/process',
				        dataType: 'json',
				        async: true,
				        //json object to sent to the authentication url
				        data:output//JSON.stringify(myJSONtext)
				        ,success:function(msg)
				       {	 
				        } 
				    }).done(function( msg ) 
				    {
				    	if(msg.ret=='success')
						{
				    	   alert('Thanh cong');
				    	   jQuery("#dlg_edit" ).dialog("close" );
				    	   jQuery("#showGrid").clearGridData();
						   jQuery("#showGrid").trigger("reloadGrid");
						}
						else
						{
							alert('Khong thanh cong!');
						}		
				   });
				}	
		    },
		    Edit:{text:'Sửa',
				click:function() {
				 
				   if(!check_Data()) return;
					var myJSONtext=$('#myForm').toJSON();
					var method={act:'edit'};
					var output = {};
					output = jsonConcat(output, myJSONtext);
					output = jsonConcat(output, method);				
					$.ajax
				    ({
				        type: "POST",
				        url: '<?php echo base_url(); ?>admin/categories/process',
				        dataType: 'json',
				        async: true,
				        //json object to sent to the authentication url
				        data:output//JSON.stringify(myJSONtext)
				        ,success:function(msg)
				       {	 
				        } 
				    }).done(function( msg ) 
				    {
				    	if(msg.ret=='success')
						{
				    	  alert('Thanh cong');
				    	  jQuery( "#dlg_edit" ).dialog("close" );
				    	  jQuery("#showGrid").clearGridData();
						  jQuery("#showGrid").trigger("reloadGrid");
						}
						else
						{
							alert('Khong thanh cong!');
						}	
				   });
				}	
		    }
		  }
	});//End open dialog
    
	switch (control)
	{
		case 'display':
			openDlg=fill_Data();
		    break;
		case 'add':
			openDlg=clear_Data();
		    break;
		case 'edit':
			openDlg=fill_Data();
		    break;
		case 'del':
			deleteRecord();
			break;
		default:
	    alert('No process');
	}
	if(openDlg==true)
	{
		jQuery( "#dlg_edit" ).dialog({autoOpen: true});//End open	
    }
}
/*--------------------End Process Data---------------------------*/

function deleteRecord()
{
	checkAdsession();
	var id = jQuery("#showGrid").jqGrid('getGridParam','selrow'); 
	if (id) 
	{ 
		var ret = jQuery("#showGrid").jqGrid('getRowData',id);
		
		$( "#dlg_confirm_delete" ).dialog({
			resizable: false,
			height:140,
			
			modal: true,
			buttons: {
			"Xóa": function() {
			        blockflag = true;
			        var id_edit=ret.id;
					var name_edit=ret.name;
			        
					var data={act:'del',id_edit:id_edit,name_edit:name_edit};
						$.ajax({
						   type: "POST",
						   url:  '<?php echo base_url(); ?>admin/categories/process',
						   data: data,
						   dataType: 'json',
						   async:true,
						   error: function(){
		        			 $( "#dlg_error" ).dialog({
					   			modal: true,
					   			buttons: {
					   				OK: function() {
										$( this ).dialog( "close" );
									}
								}
							});
		        			 blockflag = false;
						   },
						   success: function(msg){
						   	if (msg.ret="success"){
						   		alert("Xoa thanh cong!");
						   		jQuery("#showGrid").clearGridData();
								jQuery("#showGrid").trigger("reloadGrid");
						   	}else
						   	{
						   		alert("Xoa khong thanh cong!");
							}
						   }
					    });
				$( this ).dialog( "close" );
			},
			"Thoát": function() {
				$( this ).dialog( "close" );
			}
		}
	});
   }else
   {
	   alert("Please select row!");
   }
}

</script>
		<div id="dlg_edit" style="display: none; padding: 5px;"
			title='Sua form'>
			<div class="form-container-dialog ui-helper-clearfix  ui-corner-all">
				<form id='myForm'>
					<table >
						<tr>
							<td align="left" valign="top" width="50%">
								<div class="form-panel-auto-dialog">
									<fieldset class="ui-corner-all">
										<table width="100%" height="120px">
											<tr>
												<td align="left" valign="top" width="150px" ><label
													for="id_edit" style='width: 150px;'>Id:</label></td>
												<td align="left" valign="top" width="350px" ><input
													type="hidden" name="id" id="id"
													class="text ui-widget-content ui-corner-all" maxlength="10"
													size="0" /> <input type="text" name="id_edit"
													onkeydown="javascript:return enterPressed(event);"
													id="id_edit" readonly
													class="text ui-widget-content ui-corner-all" maxlength="20"
													size="10"
													style="border: 1px solid red !important; background: #FFF37B !important;" />
												</td>
											</tr>
											<tr>
												<td align="left" valign="top"><label for="name_edit"
													style="float: left;">Tên:</label></td>
												<td align="left" valign="top"><input type="text"
													name="name_edit"
													style="float: left; "
													
													id="name_edit" 
													class="text ui-widget-content ui-corner-all" maxlength="50"
													size="25" /> <font color="#FF0000" style='float: left;'>*</font>

												</td>
											</tr>
											<tr>
												<td align="left" valign="top"><label for="value_edit">Giá trị:</label></td>
												<td align="left" valign="top"><input type="text"
													name="value_edit" 
													id="value_edit" 
													class="text ui-widget-content ui-corner-all" maxlength="30"
													size="25"  /></td>
											</tr>
											<tr>
												<td align="left" valign="top" width="120px"><label
													style="float: left; width: 120px"
													for="desc_edit">mô tả:</label></td>
												<td>
													<input type="text"
													name="desc_edit"
													id="desc_edit" 
													class="text ui-widget-content ui-corner-all" maxlength="30"
													size="25"  />
												</td>
											</tr>
										</table>
									</fieldset>
								</div>
							</td>
						</tr>
					</table>
				</form>
			</div>
		</div>
	</td>
</tr>

<?php $this->load->view('admin/common/footer'); ?>